<template>
  <section class="page-container">
    <iframe
      :src="`https://dony.online/static/js/pdfjs-2.16.105-dist/web/viewer.html?file=${encodeURIComponent(pdfVisitUrl)}`"
      frameborder="0"
      class="pdf-window"
    />
  </section>
</template>

<script lang="ts" setup name="PdfPreview">
/**
 * @description: 使用 pdf.js 进行PDF预览，已下载插件 /lib/pdfjs-2.16.105-dist/*
 * 官网地址：http://mozilla.github.io/pdf.js/getting_started/#download
 * 预览文件：/lib/pc-ui-design-specification-v2.0.pdf
 */
import { ref } from 'vue';
const pdfVisitUrl = ref('https://dony.online/static/js/pdfjs-2.16.105-dist/pc-ui-design-specification-v2.0.pdf');
</script>
<style lang="scss" scoped>
.page-container {
  height: 100%;

  .pdf-window {
    width: 100%;
    height: 100%;
    border-bottom: 1px solid #ececec;
  }
}

</style>
